<script setup>
import { ArrowDown } from '@element-plus/icons-vue'
import { onMounted, ref } from 'vue'

// 声明登陆用户信息对象
let showName = ref({})
// 钩子函数调用
onMounted(() => {
  loginInfo()
})
// 查询登录用户信息函数
const loginInfo = () => {
  let session = sessionStorage.getItem('BOSS_TOKEN')
  if (session) {
    // 将json字符串解析为json对象
    showName.value = JSON.parse(session).showName
  }
}
</script>

<template>
  <div>
    <el-row :gutter="20">
      <el-col :span="20" :offset="0"></el-col>
      <el-col :span="1" :offset="1">
        <el-dropdown style="margin-top: 10px">
          <el-button type="primary" round>
            {{ showName }}
            <el-icon class="el-icon--right"><arrow-down /></el-icon>
          </el-button>
          <template #dropdown>
            <el-dropdown-menu>
              <el-dropdown-item>退出系统</el-dropdown-item>
            </el-dropdown-menu>
          </template>
        </el-dropdown>
      </el-col>
    </el-row>
  </div>
</template>

<style scoped></style>
